<template>
	<view :style="$s.view_color">
		<my-navbar :name="nav_title"></my-navbar>
		
		<view class="page-search-address">
			<view class="header">
				<u-search placeholder="搜索地址" v-model="keyword" @change="getAddress"></u-search>
			</view>
			<scroll-view class="address-list" :scrollY="true">
				<block v-for="(item,index) in list" :key="index">
					<view class="address-item" @click="selectAddress(item)">
						<view class="name">{{item.title}}</view>
						<view class="address">{{item.address}}</view>
					</view>
				</block>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				nav_title:'地址',
				$s:this.$s,
				type:'',
				list:[],
				keyword:'',
				config:'',
			}
		},
		onLoad(option){
			if(option.type!=null && option.type!=undefined){
				this.type=option.type
			}else{
				this.$c.error('缺少参数','index/index')
			}
		},
		onShow(){
			this.initData()
		},
		methods: {
			initData(){
				
			},
			//搜索地址
			getAddress(){
				let keyword=this.keyword
				if(keyword!=''){
					this.$u.api.mapSearch({
						region:this.$store.state.$defaultCity,
						key:this.keyword,
					}).then(res=>{
						this.list=res.data
					})
				}
			},
			//选择地址
			selectAddress(item){
				if(this.type=='gain'){
					this.$store.commit('gainAddress2',item)
				}else if(this.type=='back'){
					this.$store.commit('backAddress2',item)
				}
				uni.navigateBack({
				    delta: 2
				});
			}
		}
	}
</script>

<style lang="scss">
	.page-search-address {
	    display: -ms-flexbox;
	    display: flex;
	    flex-direction: column;
	    height: calc(100vh - 64px);
	}
	
	.page-search-address .header {
	    padding: 20rpx 30rpx;
	    background: #fff;
	}
	
	.page-search-address .address-list {
	    display: block;
	    flex: 1;
	    height: 100%;
	    overflow: hidden;
	}
	
	.page-search-address .address-list .address-item {
	    display: block;
	    padding: 20rpx 30rpx;
	    border-top: 1px solid rgba(60,60,90,.05);
	}
	
	.page-search-address .address-list .address-item.first {
	    border-top: none;
	}
	
	.page-search-address .address-list .address-item:active {
	    opacity: .7;
	}
	
	.page-search-address .address-list .address-item .name {
	    display: block;
	    font-weight: 700;
	    font-size: 30rpx;
	}
	
	.page-search-address .address-list .address-item .address {
	    display: block;
	    font-size: 26rpx;
	    opacity: .6;
	}
</style>
